<template>

  <div class="main user-layout-register" style="background-color: #ffffff; padding: 20px 0 0 20px;border-radius:10px;">
    <div style=" position: absolute; top:30px; margin: 0 auto; width:820px; text-align: center; color: #fff; font-size: 30px; font-weight: bold;">
      {{ projectTitle }}</div>

    <h3><span>企业基本信息</span></h3>
    <a-form ref="formRegister" :autoFormCreate="(form)=>{this.form = form}" id="formRegister">
      <div style="max-height: 500px; overflow-y: scroll;">
        <a-row>
          <a-col :span="12">
            <a-form-item label="登录账号" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="username"
                         :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^1[3456789]\d{9}$/, message: '账号必须是登录金谷零工的微信所绑定手机号'}, { validator: this.checkUsername }], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <a-input size="large" type="text" autocomplete="false" placeholder="登录金谷零工的微信所绑定手机号"></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="登录密码" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="password"
                         :fieldDecoratorOptions="{rules: [{ required: true, message: '密码长度8至16位，且由数字、大小写字母和特殊符号组成!'}, { validator: this.handlePasswordLevel }], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <a-input size="large" type="password" @click="handlePasswordInputClick" autocomplete="false" placeholder="至少8至16位数字大小写字母符号"></a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-item label="纳税人识别号" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="nsrsbh"
                         :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^[A-Z0-9]{15,20}$/, message: '请输入15-20位纳税人识别号'}, { validator: this.checknsrsbh }], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <a-input size="large" type="text" autocomplete="false" placeholder="请输入纳税人识别号"></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="公司名称" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="corpname"
                         :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^[\u4e00-\u9fa5&（）《》]{2,30}$/, message: '请输入2-30位中文或括号,&及书名号'}, { validator: this.checkcorpname }], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <!--:fieldDecoratorOptions="{rules: [{ required: true, pattern: /^.{2,30}$/, message: '请输入2-30位公司名称'}, { validator: this.checkcorpname }], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
              <a-input size="large" type="text" autocomplete="false" placeholder="请输入公司名称"></a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-item label="联系人姓名" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="lxrxm"
                         :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^.{2,32}$/, message: '请输入正确的联系人姓名'}], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <a-input size="large" type="text" autocomplete="false" placeholder="请输入联系人姓名"></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="联系人手机" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="lxrsj"
                         :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号'}], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <a-input size="large" type="text" autocomplete="false" placeholder="请输入正确的手机号"></a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-item label="开户行" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="khh"
                         :fieldDecoratorOptions="{rules: [{ pattern: /^.{4,32}$/, message: '请输入4-32位开户行名称'}], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <a-input size="large" type="text" autocomplete="false" placeholder="请输入开户行"></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="对公账号" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="dgzh"
                         :fieldDecoratorOptions="{rules: [{ pattern: /^[0-9]{8,25}$/, message: '请输入8-25位对公账号'}], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <a-input size="large" type="text" autocomplete="false" placeholder="请输入对公账号"></a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-item label="邮箱" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="yx"
                         :fieldDecoratorOptions="{rules: [{ required: false, type: 'email', pattern: /^([\w]+\.*)([\w]+)@[\w]+\.\w{3}(\.\w{2}|)$/, message: '请输入正确的邮箱'}], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <a-input size="large" type="text" autocomplete="false" placeholder="请输入正确的邮箱"></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="注册地址" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="registerAddress"
                         :fieldDecoratorOptions="{rules: [{ required: false, pattern: /^.{2,50}$/, message: '请输入2-50位注册地址'}], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <a-input size="large" type="text" autocomplete="false" placeholder="请输入注册地址"></a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="12">
            <a-form-item label="办公地址" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="officeAddress"
                         :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^.{2,50}$/, message: '请输入2-50位办公地址'}], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <a-input size="large" type="text" autocomplete="false" placeholder="请输入办公地址"></a-input>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="8">
            <a-form-item label="营业执照图片" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="yyzztp"
                         :fieldDecoratorOptions="{rules: [{ required: true, message: '营业执照图片必须上传'}], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <j-image-upload isMultiple number="1" ></j-image-upload>
            </a-form-item>
          </a-col>
          <a-col :span="8">
            <a-form-item label="logo" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="logo"
                         :fieldDecoratorOptions="{rules: [{ required: true, message: 'logo图片必须上传'}], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <j-image-upload isMultiple number="1" ></j-image-upload>
            </a-form-item>
          </a-col>
          <a-col :span="8">
            <a-form-item label="场所" :labelCol="labelCol" :wrapperCol="wrapperCol"
                         fieldDecoratorId="csImg"
                         :fieldDecoratorOptions="{rules: [{ required: true, message: '场所图片必须上传'}], validateTrigger: ['change', 'blur'], validateFirst: true}">
              <j-image-upload isMultiple number="1" ></j-image-upload>
            </a-form-item>
          </a-col>
        </a-row>
        <!--<a-row>-->
        <!--<a-col :span="12">-->
        <!--  <a-form-item label="开户凭证" :labelCol="labelCol" :wrapperCol="wrapperCol"-->
        <!--               fieldDecoratorId="khpz"-->
        <!--               :fieldDecoratorOptions="{rules: [{ required: false, message: '开户凭证图片必须上传'}], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
        <!--    <j-image-upload isMultiple number="1" ></j-image-upload>-->
        <!--  </a-form-item>-->
        <!--</a-col>-->
        <!--  <a-col :span="12">-->
        <!--    <a-form-item label="法定代表人" :labelCol="labelCol" :wrapperCol="wrapperCol"-->
        <!--                 fieldDecoratorId="fddbr"-->
        <!--                 :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^.{2,32}$/, message: '请输入正确的法定代表人'}], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
        <!--      <a-input size="large" type="text" autocomplete="false" placeholder="请输入法定代表人"></a-input>-->
        <!--    </a-form-item>-->
        <!--  </a-col>-->
        <!--  <a-col :span="12">-->
        <!--    <a-form-item label="法人身份证号" :labelCol="labelCol" :wrapperCol="wrapperCol"-->
        <!--                 fieldDecoratorId="frsfzh"-->
        <!--                 :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^[0-9]{18}$/, message: '请输入正确的法人身份证号'}], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
        <!--      <a-input size="large" type="text" autocomplete="false" placeholder="请输入法人身份证号"></a-input>-->
        <!--    </a-form-item>-->
        <!--  </a-col>-->
        <!--</a-row>-->
        <!--<a-row>-->
        <!--  <a-col :span="12">-->

        <!--  </a-col>-->
        <!--  <a-col :span="12">-->
        <!--    <a-form-item label="确认密码" :labelCol="labelCol" :wrapperCol="wrapperCol"-->
        <!--                 fieldDecoratorId="confirmPassword"-->
        <!--                 :fieldDecoratorOptions="{rules: [{ required: true, message: '密码长度至少12位，且由数字、大小写字母和特殊符号组成!' }, { validator: this.handlePasswordCheck }], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
        <!--      <a-input size="large" type="password" autocomplete="false" placeholder="确认密码"></a-input>-->
        <!--    </a-form-item>-->
        <!--  </a-col>-->
        <!--</a-row>-->
      <!--<div style="padding: 0 20px 0 0;">-->
      <!--  <a-divider>企业开票信息</a-divider>-->
      <!--</div>-->
      <!--<a-row>-->

        <!--<a-col :span="12">-->
        <!--  <a-form-item label="税号" :labelCol="labelCol" :wrapperCol="wrapperCol"-->
        <!--               fieldDecoratorId="sh"-->
        <!--               :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^[A-Z0-9]{15,20}$/, message: '请输入15-20位税号'}, { validator: this.checksh }], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
        <!--    <a-input size="large" type="text" autocomplete="false" placeholder="请输入税号"></a-input>-->
        <!--  </a-form-item>-->
        <!--</a-col>-->
      <!--</a-row>-->
      <!--<div style="padding: 0 20px 0 0;">-->
      <!--  <a-divider>业务经办人信息</a-divider>-->
      <!--</div>-->
      <!--<a-row>-->
      <!--  <a-col :span="12">-->
      <!--    <a-form-item label="姓名" :labelCol="labelCol" :wrapperCol="wrapperCol"-->
      <!--                 fieldDecoratorId="bwtrxm"-->
      <!--                 :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^.{2,32}$/, message: '请输入正确的业务经办人姓名'}], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
      <!--      <a-input size="large" type="text" autocomplete="false" placeholder="请输入业务经办人姓名"></a-input>-->
      <!--    </a-form-item>-->
      <!--  </a-col>-->
      <!--  <a-col :span="12">-->
      <!--    <a-form-item label="身份证号" :labelCol="labelCol" :wrapperCol="wrapperCol"-->
      <!--                 fieldDecoratorId="bwtrsfzh"-->
      <!--                 :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^([1-6][1-9]|50)\d{4}(18|19|20)\d{2}((0[1-9])|10|11|12)(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/, message: '请输入正确的业务经办人身份证号'}], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
      <!--      <a-input size="large" type="text" autocomplete="false" placeholder="请输入正确的业务经办人身份证号"></a-input>-->
      <!--    </a-form-item>-->
      <!--  </a-col>-->
      <!--</a-row>-->
      <!--<a-row>-->
      <!--  <a-col :span="12">-->
      <!--    <a-form-item label="职位" :labelCol="labelCol" :wrapperCol="wrapperCol"-->
      <!--                 fieldDecoratorId="bwtrzw"-->
      <!--                 :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^.{2,32}$/, message: '业务经办人职位'}], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
      <!--      <a-input size="large" type="text" autocomplete="false" placeholder="业务经办人职位"></a-input>-->
      <!--    </a-form-item>-->
      <!--  </a-col>-->
      <!--  <a-col :span="12">-->
      <!--    <a-form-item label="手机号" :labelCol="labelCol" :wrapperCol="wrapperCol"-->
      <!--                 fieldDecoratorId="bwtrsjh"-->
      <!--                 :fieldDecoratorOptions="{rules: [{ required: true, pattern: /^1[3456789]\d{9}$/, message: '该电话号用于登录和接收短信，请仔细核对'}], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
      <!--      <a-input size="large" type="text" autocomplete="false" placeholder="用于登录和接收短信，请仔细核对"></a-input>-->
      <!--    </a-form-item>-->
      <!--  </a-col>-->
      <!--</a-row>-->
      <!--<a-row>-->
      <!--  <a-col :span="12">-->
      <!--    <a-form-item label="身份证正面照" :labelCol="labelCol" :wrapperCol="wrapperCol"-->
      <!--                 fieldDecoratorId="bwtrsfzzmz"-->
      <!--                 :fieldDecoratorOptions="{rules: [{ required: true, message: '业务经办人身份证正面照必须上传'}], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
      <!--      <j-image-upload isMultiple number="1" ></j-image-upload>-->
      <!--    </a-form-item>-->
      <!--  </a-col>-->
      <!--  <a-col :span="12">-->
      <!--    <a-form-item label="身份证反面照" :labelCol="labelCol" :wrapperCol="wrapperCol"-->
      <!--                 fieldDecoratorId="bwtrsfzfmz"-->
      <!--                 :fieldDecoratorOptions="{rules: [{ required: true, message: '业务经办人身份证反面照必须上传'}], validateTrigger: ['change', 'blur'], validateFirst: true}">-->
      <!--      <j-image-upload isMultiple number="1" ></j-image-upload>-->
      <!--    </a-form-item>-->
      <!--  </a-col>-->
      <!--</a-row>-->
      </div>
      <a-row>
        <a-col :span="9">
        </a-col>
        <a-col :span="15">
          <a-form-item style="float: right;">
            <a-button
              style="width: 80px; margin-right: 10px;"
              size="mini"
              type="primary"
              htmlType="submit"
              class="register-button"
              :loading="registerBtn"
              @click.stop.prevent="handleSubmit"
              :disabled="registerBtn">提交审核
            </a-button>
            <a-button
              style="width: 150px; margin-right: 30px;"
              size="mini"
              type="primary"
              class="register-button"
              @click.stop.prevent="tologin"
              :disabled="registerBtn">使用已有账户登录
            </a-button>
           <!-- <router-link class="login" :to="{ name: 'login' }">使用已有账户登录</router-link>-->
          </a-form-item>
        </a-col>
      </a-row>

      <a-modal
        title="签署合同"
        :visible="registerUserModel.visible"
        :confirm-loading="registerUserModel.confirmLoading"
        width="660px"
        okText="确认签署"
        cancelText="关闭"
        @ok="sendMessage"
        @cancel="handleCancel"

      >
        <div id="ht" style="width:620px;height:400px;overflow-y:auto;">
          <div style="marginTop: 10px; color: #409EFF;text-align:center">{{ pageNum }} / {{ pageTotalNum }}</div>
          <pdf ref="pdf" :page="pageNum" :src="htImgUrl"  @progress="loadedRatio"  @num-pages="pageTotalNum=$event"   style="width: 600px;"></pdf>
          <button type="primary" icon="el-icon-arrow-left" size="mini" @click="prePage" v-show="pageNum>1">上一页</button>
          <button type="primary" size="mini" @click="nextPage" v-show="pageNum<pageTotalNum">下一页<i class="el-icon-arrow-right el-icon&#45;&#45;right"></i></button>
        </div>
      </a-modal>

      <a-modal
        title="签署合同确认验证码"
        :visible="visibleYzm"
        @ok="handleSubmit"
        @cancel="yzmClose"
      >
        <a-form-item label="请输入验证码" :labelCol="{ xs: { span: 23 }, sm: { span: 6 }}" :wrapperCol="wrapperCol">
          <a-input  v-model="smscode"/>
        </a-form-item>
      </a-modal>
    </a-form>
  </div>
</template>

<script>
  import {mixinDevice} from '@/utils/mixin.js'
  import {getSmsCaptcha} from '@/api/login'
  import {getAction, postAction} from '@/api/manage'
  import {checkOnlyUser, checkOnlyCorpinfo} from '@/api/api'
  import JImageUpload from '@/components/jeecg/JImageUpload'
  import pdf from 'vue-pdf'

  const levelNames = {
    0: '低',
    1: '低',
    2: '中',
    3: '强'
  }
  const levelClass = {
    0: 'error',
    1: 'error',
    2: 'warning',
    3: 'success'
  }
  const levelColor = {
    0: '#ff0000',
    1: '#ff0000',
    2: '#ff7e05',
    3: '#52c41a',
  }
  export default {
    name: "Register",
    components: {
      JImageUpload,
      pdf,
    },
    mixins: [mixinDevice],
    data() {
      return {
        form: null,
        htImgUrl:'',
        pageNum: 1,
        pageTotalNum: 1,
        loadedRatio: 0,
        visibleYzm:false,
        smscode:'',
        labelCol: {
          xs: { span: 24 },
          sm: { span: 6 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        state: {
          time: 60,
          smsSendBtn: false,
          passwordLevel: 0,
          passwordLevelChecked: false,
          percent: 10,
          progressColor: '#FF0000'
        },
        registerBtn: false,
        registerUserModel:{
          visible: false,
          confirmLoading: false
        },
        validatorRules: {
          yyzztp: {
            rules: [
              { required: true, message: '请上传营业执照图片!'},
            ]
          },
          logo: {
            rules: [
              { required: true, message: '请上传logo图片!'},
            ]
          },
          csImg: {
            rules: [
              { required: true, message: '请上传场所图片!'},
            ]
          },
        },
        projectTitle: '',
      }
    },
    computed: {
      passwordLevelClass() {
        return levelClass[this.state.passwordLevel]
      },
      passwordLevelName() {
        return levelNames[this.state.passwordLevel]
      },
      passwordLevelColor() {
        return levelColor[this.state.passwordLevel]
      }
    },
    created () {
      this.projectTitle = window._CONFIG['projectTitle'] || '零工平台';
    },
    methods: {
      checkUsername(rule, value, callback) {
        var params = {
          username: value,
        };
        checkOnlyCorpinfo(params).then((res) => {
          if (res.success) {
            callback()
          } else {
            callback("登录账号已存在!")
          }
        })
      },

      checksh(rule, value, callback) {
        var params = {
          sh: value,
        };
        checkOnlyCorpinfo(params).then((res) => {
          if (res.success) {
            callback()
          } else {
            callback("税号已存在!")
          }
        })
      },

      checkcorpname(rule, value, callback) {
        var params = {
          corpname: value,
        };
        checkOnlyCorpinfo(params).then((res) => {
          if (res.success) {
            callback()
          } else {
            callback("企业名称已存在!")
          }
        })
      },

      checknsrsbh(rule, value, callback) {
        var params = {
          nsrsbh: value,
        };
        checkOnlyCorpinfo(params).then((res) => {
          if (res.success) {
            callback()
          } else {
            callback("纳税人识别号已存在!")
          }
        })
      },
      handleEmailCheck(rule, value, callback) {
        var params = {
          email: value,
        };
        checkOnlyUser(params).then((res) => {
          if (res.success) {
            callback()
          } else {
            callback("邮箱已存在!")
          }
        })
      },
      handlePasswordLevel(rule, value, callback) {

        let level = 0
        let reg = /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,./]).{8,16}$/;
        if (!reg.test(value)) {
          callback(new Error('密码长度8至16位，且由数字、大小写字母和特殊符号组成!'))
        }
        // 判断这个字符串中有没有数字
        if (/[0-9]/.test(value)) {
          level++
        }
        // 判断字符串中有没有字母
        if (/[a-zA-Z]/.test(value)) {
          level++
        }
        // 判断字符串中有没有特殊符号
        if (/[^0-9a-zA-Z_]/.test(value)) {
          level++
        }
        if (level >= 3) {
          callback()
        } else {
          callback(new Error('密码强度不够'))
        }
        /*this.state.passwordLevel = level
        this.state.percent = level * 30
        if (level >= 2) {
          if (level >= 3) {
            this.state.percent = 100
          }
          callback()
        } else {
          if (level === 0) {
            this.state.percent = 10
          }
          callback(new Error('密码强度不够'))
        }*/
      },

      handlePasswordCheck(rule, value, callback) {
        let password = this.form.getFieldValue('password')
        //console.log('value', value)
        if (value === undefined) {
          callback(new Error('请输入密码'))
        }
        if (value && password && value.trim() !== password.trim()) {
          callback(new Error('两次密码不一致'))
        }
        callback()
      },

      handlePhoneCheck(rule, value, callback) {
        var params = {
          phone: value,
        };
        checkOnlyUser(params).then((res) => {
          if (res.success) {
            callback()
          } else {
            callback("手机号已存在!")
          }
        })
      },

      handlePasswordInputClick() {
        if (!this.isMobile()) {
          this.state.passwordLevelChecked = true
          return;
        }
        this.state.passwordLevelChecked = false
      },
      handleSubmit() {
        const that = this;
        this.form.validateFields((err, values) => {
          if (!err) {
            values.smscode = that.smscode;
            postAction("/sys/user/register", values).then((res) => {
              if (!res.success) {
                this.registerFailed(res.message)
                this.registerUserModel.visible = false
              } else {
                this.$router.push({name: 'registerResult', params: {...values}})
              }
            })
          }else {
            that.$message.error("填写信息不完整或不正确")
          }
        })
      },
      showHt(){
        const that = this;
        this.form.validateFields((err, values) => {
          if (!err) {
            postAction("/sys/user/scht", values).then((res) => {
              if (res.success) {
                that.htImgUrl = res.result.hturl;
                this.registerUserModel.visible = true
              } else {
                that.$message.error("生成合同失败")
              }
            })
          }
        })
      },
      handleOk(){
        /*sessionStorage.setItem("tbCustomer",JSON.stringify(this.tbCustomer))
        if(this.tbCustomer.usertype==1){
          this.$router.push({ path: '/user/register' })
        }else{
          this.$router.push({ path: '/user/customers' })
        }
        this.loginPanel = false*/
      },
      handleCancel(){
        this.registerUserModel.visible = false
      },
      tologin() {
        this.$router.push({name: 'login'})
      },

      getCaptcha(e) {
        e.preventDefault()
        let that = this
        this.form.validateFields({force: true}, (err, values) => {/*
            if (!err) {
              this.state.smsSendBtn = true;
              let interval = window.setInterval(() => {
                if (that.state.time-- <= 0) {
                  that.state.time = 60;
                  that.state.smsSendBtn = false;
                  window.clearInterval(interval);
                }
              }, 1000);
              const hide = this.$message.loading('验证码发送中..', 0);
              const params = {
                mobile: values.mobile,
                smsmode: "1"
              };
              postAction("/sys/sms", params).then((res) => {
                if (!res.success) {
                  this.registerFailed(res.message);
                  setTimeout(hide, 0);
                }
                setTimeout(hide, 500);
              }).catch(err => {
                setTimeout(hide, 1);
                clearInterval(interval);
                that.state.time = 60;
                that.state.smsSendBtn = false;
                this.requestFailed(err);
              });
            }*/
          }
        );
      },
      registerFailed(message) {
        this.$notification['error']({
          message: "注册失败",
          description: message,
          duration: 2,
      });

      },
      requestFailed(err) {
        this.$notification['error']({
          message: '错误',
          description: ((err.response || {}).data || {}).message || "请求出现错误，请稍后再试",
          duration: 4,
        });
        this.registerBtn = false;
      },
      // 上一页
      prePage() {
        let page = this.pageNum
        page = page > 1 ? page - 1 : this.pageTotalNum
        this.pageNum = page
        document.getElementById('ht').scrollTop = 0;
      },

      // 下一页
      nextPage() {
        let page = this.pageNum
        page = page < this.pageTotalNum ? page + 1 : 1
        this.pageNum = page
        document.getElementById('ht').scrollTop = 0;
      },
      htClose(){
        this.visibleHt = false
      },
      yzmClose(){
        this.visibleYzm = false
      },
      //签署合同并发送短信
      sendMessage(){
        const that = this;
        this.form.validateFields((err, values) => {
          if (!err) {
            postAction("/sys/user/qsht", values).then((res) => {
              if (res.success) {
                this.visibleYzm = true;
              } else {
                that.$message.error("合同签署失败")
              }
            })
          }
        })
      },
    },
    watch: {
      'state.passwordLevel'(val) {
        console.log(val)

      }
    }
  }
</script>
<style lang="less">
  .user-register {

    &.error {
      color: #ff0000;
    }

    &.warning {
      color: #ff7e05;
    }

    &.success {
      color: #52c41a;
    }

  }

  .user-layout-register {
    .ant-input-group-addon:first-child {
      background-color: #fff;
    }
  }
</style>
<style lang="less" scoped>
  .user-layout-register {

    & > h3 {
      font-size: 16px;
      margin-bottom: 20px;
    }

    .getCaptcha {
      display: block;
      width: 100%;
      height: 40px;
    }

    .register-button {
      width: 50%;
    }

    .login {
      float: right;
      line-height: 40px;
    }
  }
</style>
